import {Button, message, Table} from 'antd';
import type {ColumnsType} from 'antd/es/table';
import React, {useEffect, useState} from 'react';
import {paginationQuery} from "@/services/lapi-backend/UserInterfaceInfo";
import {history} from "umi"

const columns: ColumnsType<API.UserInterfaceVo> = [
  {
    title: '名称',
    align: 'center',
    dataIndex: 'name',
  },

  {
    title: '接口描述',
    align: 'center',
    dataIndex: 'description',
  },
  {
    title: '剩余调用次数',
    align: 'center',
    dataIndex: 'leftNum',
  },
  {
    title: '已使用次数',
    align: 'center',
    dataIndex: 'totalNum',
  },
  {
    title: "操作",
    dataIndex: "status",
    align: 'center',
    width: '450px',
    render: (r, userInterface, index) => {
      return (
        <>
          <Button type={"link"} onClick={() => {
            history.push(`/invoke/${userInterface.interfaceInfoId}`)
          }}> 模拟调用 </Button>
        </>
      )
    }
  }
];

const App: React.FC = () => {
  const [userInterfaceVoData, setUserInterfaceVoData] = useState<API.UserInterfaceVo[]>([])
  const [pageNow, setPageNow] = useState<number>(1);
  const [pageSize, setPageSize] = useState<number>(10);
  const [pageParam, setPagePram] = useState<API.paginationQueryUsingGETParams>({pageNow: 1, pageSize})
  const [total, setTotal] = useState<number>(0)
  const [loading, setLoading] = useState<boolean>(false)
  const pageQuery = () => {
    setLoading(true)
    paginationQuery(pageParam, {}).then(r => {
      if (r.code == 0) {
        const t: API.UserInterfaceVo[] = r.data?.data;
        setTotal(r.data?.total)
        setUserInterfaceVoData(t);
      } else {
        message.error(r.message)
      }
      setLoading(false)
    })
  }
  useEffect(() => {
    pageQuery();
  }, [])
  return (
    <>
      <Table columns={columns}
             loading={loading}
             pagination={
               {
                 showTotal: (total, range) => {
                   return "总记录条数:" + total + "条"
                 },
                 showQuickJumper: true,
                 pageSize,
                 total: total,
                 position: ["bottomCenter"],
                 onChange: (page) => {
                   setPageNow(page)
                   pageParam.pageNow = page;
                   pageQuery()
                 }
               }
             }
             dataSource={userInterfaceVoData}
      />
    </>
  )
};

export default App;
